<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    let obj = {
        id: 1,
        name: "张三",
        age: 20,
        phone: "11111111111",
        say() {
            console.log("没有this.的name，会先在全局中去找", name);
            console.log(this.name + "说话")
        },
        work: function () {
            console.log("在工作")
        }
    };
    console.log(obj);
    let name = "李四";
    // 中间有100行代码
    let age = 24;
    console.log(obj.age);
    document.write(obj.name + obj.age);
    // 在JS中，方法的本质就是属性
    obj.say();
    obj.work();
    // 在运行时动态的添加属性和方法
    obj.hobby = "打游戏";
    console.log(obj);
    obj.sport = function () {
        console.log("运动")
    }

    // 中括号语法，打印obj对象的name属性
    console.log(obj["name"]);
    // console.log(obj[name]); // 打印obj对象的李四属性

    /*
        在单个处理属性时，使用.语法比较方便
        在批量处理多个属性时，使用[]语法更方便，需要处理的属性是一个变量
     */
    // 批量打印id、name、age三个属性
    let arr = ["id", "name", "age"];
    for (let i = 0; i < arr.length; i++) {
        console.log(obj[arr[i]]);
    }
    // 在prompt中输入，想打印的属性名称
    let prop = prompt("请输入需要打印的属性名称");
    console.log(obj[prop]);

    obj.name = "haha";
    obj.say();

    // 删除属性和方法
    delete obj.name;
    console.log(obj.name);
    delete obj.say;
    console.log(obj);

    // 对象的遍历：将内容或属性一个个过一遍，一般配合循环
    // obj的遍历不能使用计数for循环，因为obj没有length属性
    // for (let i = 0; i < obj.length; i++) {}
    // for-in循环，一般通用名key，value，item
    for (let key in obj) {
        // 不能打印函数
        if (typeof(obj[key]) == "function") {
            continue;
        }
        console.log(key);
        // 如何打印值
        console.log(obj[key]);
    }

    // 属性名简写：当属性key和value的变量名一致时，可以简写
    let phone = "11111";
    let obj1 = {
        // phone: phone
        phone
    }
    console.log(obj1);

    // let hobby = obj.hobby;
    // let work = obj.work;
    let {hobby, work} = obj;
    console.log(hobby, work);

    let obj3 = (function () {
        let money = Symbol("money");
        return {
            _age: 20,
            [money]: 1000,
            info() {
                console.log(this[money]);
            }
        }
    })();
    // console.log(obj3[money]);
    console.log(obj3.info());
    console.log(obj3._age);
    delete obj3._age;
    // console.log(obj3.)
</script>
</body>
</html>